import { FormProps, FormSchema } from '/@/components/Table';
import { BasicColumn } from '/@/components/Table/src/types/table';
import { getJulyDictItemListByTypeApi } from '/@/api/admin/julyDictItemApi';
import { uploadApi } from '/@/api/sys/upload';
import {h} from "vue";
import {Tag} from "ant-design-vue";


//表格显示列
export function getBasicColumns(): BasicColumn[] {
  // @ts-ignore
  return [
    {
      title: 'ID',
      dataIndex: 'bannerId',
      fixed: 'left',
      width: 100,
    },
    {
      title: 'banner名称',
      dataIndex: 'bannerName',
      width: 150,

    },
    {
      title: '链接类型',
      dataIndex: 'linkType',
      width: 100,
      customRender: ({record}) => {
        let linkType = record.linkType;
        let color = ''
        switch (linkType) {
          case '0':
            linkType = '外链';
            color = 'green'
            break;
          case '1':
            linkType = '内链';
            color = 'purple'
            break;
        }
        return h(Tag, {color: color}, () => linkType);
      },
    },
    {
      title: '链接目标',
      dataIndex: 'linkTarget',
      width: 150,
      //sorter: true,
      //defaultHidden: true,
    },
    {
      title: '排序',
      width: 100,
      dataIndex: 'indexOrder',
    },
    {
      title: '上架状态',
      width: 100,
      dataIndex: 'status',
      customRender: ({record}) => {
        let status = record.status;
        let color = ''
        switch (status) {
          case '0':
            status = '上架';
            color = 'green'
            break;
          case '1':
            status = '下架';
            color = 'purple'
            break;
        }
        return h(Tag, {color: color}, () => status);
      },
    },

  ];
}

export function getFormConfig(): Partial<FormProps> {
  return {
    labelWidth: 150,
    baseColProps: { lg: 6, md: 24 },
    schemas: formParamSchema,
  };
}


//编辑表单
export const formParamSchema: FormSchema[] = [
  {
    field: 'bannerName',
    label: 'banner名称',
    component: 'Input',
  },
  {
    field: 'linkType',
    label: '链接类型',
    component: 'ApiSelect',
    componentProps: {
      api: getJulyDictItemListByTypeApi,
      params: { type: 'LINK_TYPE' },
      labelField: 'label',
      valueField: 'value',
    },
  },
];

//编辑表单
export const formSchema: FormSchema[] = [
  {
    field: 'bannerName',
    label: 'banner名称',
    component: 'Input',
    required: true,
  },
  {
    field: 'linkType',
    label: '链接类型',
    component: 'ApiSelect',
    componentProps: {
      api: getJulyDictItemListByTypeApi,
      params: { type: 'LINK_TYPE' },
      labelField: 'label',
      valueField: 'value',
    },
  },

  {
    field: 'linkTarget',
    label: '链接目标',
    component: 'Input',
  },
  {
    field: 'indexOrder',
    label: '排序',
    component: 'InputNumber',
    required: true,
  },
  {
    field: 'bannerImg',
    label: 'banner图片',
    component: 'Upload',
    componentProps: {
      api: uploadApi,
      accept: ['jpg', 'png', 'jpeg'],
      maxNumber: 1,
      maxSize: 1,
      helpText: '请上传png/jpg 等图片文件，文件大小小于1M,宽高比为2:1',
    },
  },
  {
    field: 'status',
    label: '上架状态',
    component: 'RadioButtonGroup',
    defaultValue: '0',
    required: true,
    componentProps: {
      options: [
        { label: '推送', value: '0' },
        { label: '不推送', value: '1' },
      ],
    },
  },
];
